﻿<!DOCTYPE html>
<html>
<head>
  <title>Fishbone</title>
  <meta name="description" content="Fishbone is a web based project management application suite. This application suit consists of portfolios & projects management, scope/requirement management, project planning, task management, defects management, time tracking, messaging, calendar management, and discussion forums" />
  <meta name="keywords" content="project management, fishbone, portfolio management, defect tracking" />
  <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
  <link rel="stylesheet/less" type="text/css" media="screen, projection" href="_css/site.less" />
  <script src="_js/less.js" type="text/javascript"></script>
  <script src="_js/lorem.js" type="text/javascript"></script>
  <!--CAUTION: Do not use any other version of JQuery. This will help us ensure x-browser support. -->
  <script src="//code.jquery.com/jquery-1.8.1.min.js" type="text/javascript"></script>
</head>
<body>
  <div class="panel" style="width: 50%; margin: 10px;">
    <div class="head fc-fix">
      <span class="title">Title of the Panel</span><a href="javascript:void(0);" class="close"></a></div>
    <div class="body help-ico">
      Curabitur eleifend euismod pellentesque. Suspendisse potenti. Curabitur metus est,
      volutpat a porttitor quis, accumsan ut orci. Fusce vulputate, felis nec suscipit
      dapibus, dolor magna varius felis, sed lobortis urna ipsum.
    </div>
    <div class="cmd">
      <a href="javascript:void(0);" class="btn b s">Enroll me now!</a> <a href="javascript:void(0);">
        Remind me later</a>
    </div>
  </div>
  <div class="panel" style="width: 50%; margin: 10px;">
    <div class="body">
      <div class="fl" style="width: 97%">
        Curabitur eleifend euismod pellentesque. Suspendisse potenti. Curabitur metus est,
        volutpat a porttitor quis, accumsan ut orci. Fusce vulputate, felis nec suscipit
        dapibus, dolor magna varius felis, sed lobortis urna ipsum at arcu.
      </div>
      <a href="javascript:void(0);" class="close"></a>
    </div>
  </div>
  <div class="panel info" style="width: 50%; margin: 10px;">
    <div class="head fc-fix">
      <span class="title">Title of the Panel</span><a href="javascript:void(0);" class="close w"></a></div>
    <div class="body check-ico">
      Curabitur eleifend euismod pellentesque. Suspendisse potenti.
    </div>
  </div>
  <div class="panel info" style="width: 50%; margin: 10px;">
    <div class="body">
      <div class="fl" style="width: 97%">
        Curabitur eleifend euismod pellentesque. Suspendisse potenti.
      </div>
      <a href="javascript:void(0);" class="close"></a>
    </div>
  </div>
  <div class="panel success" style="width: 50%; margin: 10px;">
    <div class="head fc-fix">
      <span class="title">Title of the Panel</span><a href="javascript:void(0);" class="close w"></a></div>
    <div class="body">
      Curabitur eleifend euismod pellentesque. Suspendisse potenti. Curabitur metus est,
      volutpat a porttitor quis, accumsan ut orci. Fusce vulputate, felis nec.
    </div>
  </div>
  <div class="panel success" style="width: 50%; margin: 10px;">
    <div class="body">
      <div class="fl" style="width: 97%">
        Curabitur eleifend euismod pellentesque. Suspendisse potenti. Curabitur metus est,
        volutpat a porttitor quis, accumsan ut orci. Fusce vulputate, felis nec.
      </div>
      <a href="javascript:void(0);" class="close"></a>
    </div>
  </div>
  <div class="panel error" style="width: 50%; margin: 10px;">
    <div class="head fc-fix">
      <span class="title">Title of the Panel</span><a href="javascript:void(0);" class="close w"></a></div>
    <div class="body">
      Curabitur eleifend euismod pellentesque. Suspendisse potenti. Curabitur metus est,
      volutpat a porttitor quis, accumsan ut orci. Fusce vulputate, felis nec suscipit
      dapibus, dolor magna varius felis, sed lobortis urna ipsum at arcu. Curabitur eleifend
      euismod pellentesque. Suspendisse potenti. Curabitur metus est, volutpat a porttitor
      quis, accumsan ut orci. Fusce vulputate, felis nec suscipit dapibus, dolor magna
      varius felis, sed lobortis urna ipsum at arcu.
    </div>
  </div>
  <div class="panel error" style="width: 50%; margin: 10px;">
    <div class="body warn-ico">
      <div class="fl" style="width: 97%">
        Curabitur eleifend euismod pellentesque. Suspendisse potenti. Curabitur metus est,
        volutpat a porttitor quis, accumsan ut orci. Fusce vulputate, felis nec suscipit
        dapibus, dolor magna varius felis, sed lobortis urna ipsum at arcu. Curabitur eleifend
        euismod pellentesque. Suspendisse potenti. Curabitur metus est, volutpat a porttitor
        quis, accumsan ut orci. Fusce vulputate, felis nec suscipit dapibus, dolor magna
        varius felis, sed lobortis urna ipsum at arcu.
      </div>
      <a href="javascript:void(0);" class="close"></a>
    </div>
  </div>
</body>
</html>
